<template>
	<view class="lph-order">

		<view class="od-line1" @click="onNav1">
			<view :class="['item',current == 1 ? 'line1-active': '']" id="1">
				自提订单
			</view>
			<view :class="['item',current == 2 ? 'line1-active': '']" id="2">
				配送订单
			</view>
		</view>

		<!-- 自提订单 -->
		<view v-show="current == 1" class="ztdd">
			<view class="od-line2" @click="onNav2">
				<view :class="['item', swiperCurrent1 == 0 ? 'line2-active': ''] " id="0">
					全部
				</view>
				<view :class="['item', swiperCurrent1 == 1 ? 'line2-active': ''] " id="1">
					待付款
				</view>
				<view :class="['item', swiperCurrent1 == 2 ? 'line2-active': ''] " id="2">
					待自提
				</view>
				<view :class="['item', swiperCurrent1 == 3 ? 'line2-active': '']" id="3">
					已收货
				</view>
			</view>
			<!-- 内容部分 -->
			<swiper class="goods-content" :indicator-dots="false" :autoplay="false" :duration="300" @change="changeSwiper1"
			 :current="swiperCurrent1">
				<swiper-item v-for="(row,sub) in 4" :key="sub">
					<!-- 可滚动区域 -->
					<!-- class="scroll-Y" -->
					<scroll-view :scroll-y="true" class="scrollStyle" @scrolltolower="loadMore(sub)">
						<view class="no-orderList" v-if="mentionOrder.length==0">
							<text>暂无订单</text>
						</view>
						<view v-else class="od-line3" v-for="(item,index) in mentionOrder" :key="index">
							<view class="content-line1" @click="navToShop(item)">
								<text class="line1-text2 font30">最后体验时间:{{item.get_pro_time}}</text>
							</view>
							<view class="content-line2" @click="navDetail(item)">
								<view class="line1-text1">
									<image :src="item.or_avatar" mode="aspectFill"></image>
								</view>
								<view class="line1-text2 font28">
									<view class="content-title">
										{{item.pro_name}}
									</view>
									<view class="price">
										<text class="font30">
											￥{{item.or_price}}
										</text>
										</br>
										<text class="font24">
											×{{item.or_pronum}}
										</text>
									</view>
									<view class="order-number">
										订单号:{{item.order_on}}
									</view>
								</view>
							
							</view>
							<view class="content-line3">
								<view class="line3-r">
									<text class="font24 ">
										共{{item.or_pronum}}件商品
									</text>
									<text class="font24 padding13">
										合计：
									</text>
									<text class="font30 money">
										￥{{item.totalNum}}
									</text>
								</view>
							</view>
							
							<view class="content-line4">
								<view class="operatebtn" v-if="swiperCurrent1 != 2">
									<text>{{item.status}}</text>
								</view>
								<view class="operatebtn" v-if="item.or_status == 1 && swiperCurrent1 == 0" @click="navMention(1,item)">
									<text>待自提</text>
								</view>
								<view class="operatebtn1" v-if="swiperCurrent1 == 2" @click="confirmReceipt(item,1)">
									<text>确认自提</text>
								</view>
							</view>
						</view>
						<!-- 上拉加载区域 -->
						<view v-show="isUpLoading" class="load">
							<view class="load-tip">{{loadingText}}</view>
						</view>
					</scroll-view>
					<!-- <view class="swiper-item">1</view> -->
				</swiper-item>
			</swiper>
			<!-- 这个不能删 -->
			<!-- <view class="goods-content">
				<view class="od-line3">
					<view class="content-line1">
						<text class="line1-text1 font24">最后体验时间：</text>
						<text class="line1-text2 font30">10.18</text>
						<text class="line1-text3 font22">订单号:12345678910</text>
					</view>
					<view class="content-line2">
						<view class="line1-text1">
							<image src="../../static/imgs/orderImage.png" mode=""></image>
						</view>
						<view class="line1-text2 font28">
							<view class="content-title">
								皇家猫粮室内专用10kg，满50送储粮桶...
							</view>
							<view class="price">
								<text class="font30">
									￥99999.99
								</text>
								</br>
								<text class="font24">
									×1
								</text>
							</view>

						</view>

					</view>
					<view class="content-line3">
						<text class="button3">已收货</text>
						<text class="button3 marginLeft30">提货码</text>
						<text class="font24 marginLeft48">
							共1件商品
						</text>
						<text class="font24 padding13">
							合计：
						</text>
						<text class="font30 money">
							￥99999.99
						</text>
					</view>
				</view>

			</view>
 -->

		</view>
		<!-- 配送订单 -->
		<view v-show="current == 2" class="ztdd">
			<view class="od-line2" @click="onNav3">
				<view :class="['item', swiperCurrent2 == 0 ? 'line2-active': ''] " id="0">
					全部
				</view>
				<view :class="['item', swiperCurrent2 == 1 ? 'line2-active': ''] " id="1">
					待付款
				</view>
				<view :class="['item', swiperCurrent2 == 2 ? 'line2-active': ''] " id="2">
					已付款
				</view>
				<view :class="['item', swiperCurrent2 == 3 ? 'line2-active': ''] " id="3">
					配送中
				</view>
				<view :class="['item', swiperCurrent2 == 4 ? 'line2-active': ''] " id="4">
					已收货
				</view>
			</view>
			<swiper class="goods-content" :indicator-dots="false" :autoplay="false" :duration="500" @change="changeSwiper2"
			 :current="swiperCurrent2">
				<swiper-item v-for="(row,sub) in 5" :key="sub">
					<!-- 可滚动区域 -->
					<!-- class="scroll-Y" -->
					<scroll-view :scroll-y="true" class="scrollStyle" @scrolltolower="deliveryloadMore(sub)">
						<view class="no-orderList" v-if="deliveryOrder.length==0">
							<text>暂无订单</text>
						</view>
						<view v-else class="od-line3" v-for="(item,index) in deliveryOrder" :key="index">
							<view class="content-line1" @click="navToShop(item)">
								<text class="line1-text2 font30">最后体验时间:{{item.get_pro_time}}</text>
							</view>
							<view class="content-line2" @click="navDetail(item)">
								<view class="line1-text1">
									<image :src="item.or_avatar" mode="aspectFill"></image>
								</view>
								<view class="line1-text2 font28">
									<view class="content-title">
										{{item.pro_name}}
									</view>
									<view class="price">
										<text class="font30">
											￥{{item.or_price}}
										</text>
										</br>
										<text class="font24">
											×{{item.or_pronum}}
										</text>
									</view>
									<view class="order-number">
										订单号:{{item.order_on}}
									</view>
								</view>
							
							</view>
							<view class="receipt-address">
								收货地址：
								<text>{{item.address}}</text>
							</view>
							<view class="content-line3">
								<view class="line3-r">
									<text class="font24 ">
										共{{item.or_pronum}}件商品
									</text>
									<text class="font24 padding13">
										合计：
									</text>
									<text class="font30 money">
										￥{{item.totalNum}}
									</text>
								</view>
							</view>
							<view class="content-line4">
								<view class="operatebtn" v-if="swiperCurrent2 != 2">
									<text>{{item.status}}</text>
								</view>
								<view class="operatebtn" v-if="swiperCurrent2 == 2 || item.or_status == 1" @click="navMention(2,item)">
									<text>立马配送</text>
								</view>
								<view class="operatebtn1" v-if="swiperCurrent2 == 3 && item.or_status == 2" @click="confirmReceipt(item,2)">
									<text>确认收货</text>
								</view>
							</view>
					<!-- 		<text v-if="swiperCurrent2 != 2" style="border: 1px solid #999999;color: #999999;" class="button3">{{item.status}}</text>
							<text v-if="swiperCurrent2 == 2 || item.or_status == 1" class="button3" style="margin-left: 10upx;" @click="navMention(2,item)">立马配送</text>
							<text v-if="swiperCurrent2 == 3 && item.or_status == 2" style="margin-left: 10upx;" class="button3" @click="confirmReceipt(item,2)">确认收货</text> -->
							
						<!-- 	<view class="content-line4">
								<view class="operatebtn" v-if="swiperCurrent1 != 2">
									<text>{{item.status}}</text>
								</view>
								<view class="operatebtn" v-if="item.or_status == 1 && swiperCurrent1 == 0" @click="navMention(1,item)">
									<text>待自提</text>
								</view>
								<view class="operatebtn1" v-if="swiperCurrent1 == 2" @click="confirmReceipt(item,1)">
									<text>确认自提</text>
								</view>
								<view class="operatebtn" v-if="swiperCurrent1 == 2" @click="pickUpCode(item)">
									<text>提货码</text>
								</view>
							</view>
							
							<view class="content-line1">
								<text class="line1-text1 font24">最后体验时间：</text>
								<text class="line1-text2 font30">{{item.get_pro_time}}</text>
								<text class="line1-text3 font22">订单号:{{item.orid}}</text>
							</view>
							<view class="content-line2" @click="navDetails(item,2)">
								<view class="line1-text1">
									<image :src="item.or_avatar" mode=""></image>
								</view>
								<view class="line1-text2 font28">
									<view class="content-title">
										{{item.pro_name}}
									</view>
									<view class="price">
										<text class="font30">
											￥{{item.or_price}}
										</text>
										</br>
										<text class="font24">
											×{{item.or_pronum}}
										</text>
									</view>
									<view class="receipt-address">
										收货地址：
										<text>{{item.address}}asdfad</text>
									</view>
								</view>
							</view>

							<view class="content-line3">
								<text v-if="swiperCurrent2 != 2" style="border: 1px solid #999999;color: #999999;" class="button3">{{item.status}}</text>
								<text v-if="swiperCurrent2 == 2 || item.or_status == 1" class="button3" style="margin-left: 10upx;" @click="navMention(2,item)">立马配送</text>
								<text v-if="swiperCurrent2 == 3 && item.or_status == 2" style="margin-left: 10upx;" class="button3" @click="confirmReceipt(item,2)">确认收货</text>
								<text class="font24 marginLeft48">
									共{{item.or_pronum}}件商品
								</text>
								<text class="font24 padding13">
									合计：
								</text>
								<text class="font30 money">
									￥{{item.totalNum}}
								</text>
							</view> -->
						</view>
						<!-- 上拉加载区域 -->
						<view v-show="isUpLoading" class="load">
							<view class="load-tip">{{loadingText}}</view>
						</view>
					</scroll-view>
					<!-- <view class="swiper-item">1</view> -->
				</swiper-item>
			</swiper>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loadingMask: false,
				isUpNoMore: false, // 上拉加载: 是否显示 "-- END --"
				isUpLoading: false, // 上拉加载: 是否显示 "加载中..."
				loadingText: '', //加载文字
				mentionCurrent_page: 1, //当前页
				deliveryCurrent_page: 1, //当前页
				swiperCurrent1: 0,
				swiperCurrent2: 0,
				current: 1,
				mentionOrder: [],
				deliveryOrder: [],
			}
		},
		onShow() {
			// let value = uni.getStorageSync('lph-user-info');
			// if (value.user_type == 1) {
			// 	uni.showModal({
			// 		title: '提示',
			// 		content: '您不是店家！',
			// 		success: function(res) {
			// 			if (res.confirm) {
			// 				uni.switchTab({
			// 					url: '/pages/index/index'
			// 				});
			// 			} else if (res.cancel) {
			// 				uni.switchTab({
			// 					url: '/pages/index/index'
			// 				});
			// 			}
			// 		}
			// 	});
			// }
			let token = uni.getStorageSync('lph-token');
			if(token) {
				this.swiperCurrent1 = 0
				this.swiperCurrent2 = 0
				this.shopMentionOrder(1)
			}
			
		},
		onLoad() {

		},
		methods: {
			//自提订单
			async shopMentionOrder(type) {
				// this.isUpLoading = true;
				let res = await this.$http.getShopOrder({
					type: type,
					page: this.mentionCurrent_page
				});
				this.mentionOrder = res.data
				if (this.mentionOrder.length == 0) {
					this.loadingText = ""
				}
				this.mentionOrder.forEach(item => {
					// let mun = Number(item.or_price)
					// item.totalNum = item.or_pronum * mun
					let mun = Number(item.or_price)
					item.totalNum = parseFloat(this.$format(item.or_pronum * mun)) 
					item.status = this.$common.orderStatus(item.or_status)
				})
				this.$forceUpdate();
			},
			//配送订单
			async shopDeliveryOrder(type) {
				let res = await this.$http.getDeliveryShopOrder({
					type: type,
					page: this.deliveryCurrent_page
				});
				this.deliveryOrder = res.data
				if (this.deliveryOrder.length == 0) {
					this.loadingText = ""
				}
				this.deliveryOrder.forEach(item => {
					// let mun = Number(item.or_price)
					// item.totalNum = item.or_pronum * mun
					let mun = Number(item.or_price)
					item.totalNum = parseFloat(this.$format(item.or_pronum * mun)) 
					item.status = this.$common.orderStatus(item.or_status)
				})
			},

			onNav1(e) {
				this.current = e.target.id
				this.mentionCurrent_page = 1
				this.deliveryCurrent_page = 1
				if (this.current == 1) {
					this.shopMentionOrder(1)
				} else {
					this.swiperCurrent2 = 0
					this.shopDeliveryOrder(1)
				}
			},
			navMention(type, item) {
				if (type == 1) {
					this.swiperCurrent1 = 2
					this.shopMentionOrder(3)
				} else {
					// this.swiperCurrent2 = 2
					uni.showModal({
						title: '提示',
						content: '是否马上配送？',
						success: res => {
							if (res.confirm) {
								this.shipImmediately(type, item)
							} else if (res.cancel) {

							}
						}
					});
				}
			},
			//立即配送
			async shipImmediately(type, item) {
				uni.showLoading({
					title: '加载中'
				});
				let res = await this.$http.receiptShopOrder({
					action: "order_delivery",
					order_id: item.orid
				});
				uni.hideLoading();
				if (res.code == 200) {
					uni.showToast({
						title: '开始配送成功！',
						icon: 'none',
						duration: 2000
					});
					this.shopDeliveryOrder(4)
					this.swiperCurrent2 = 3
				} else {
					uni.showToast({
						title: '操作失败！',
						icon: 'none',
						duration: 2000
					});
				}
			},
			onNav2(e) {
				this.swiperCurrent1 = e.target.id
				this.mentionCurrent_page = 1
				let type = Number(this.swiperCurrent1) + 1
				this.shopMentionOrder(type)
			},
			onNav3(e) {
				this.swiperCurrent2 = e.target.id
				this.deliveryCurrent_page = 1
				console.log(this.swiperCurrent1)
				let type = Number(this.swiperCurrent2) + 1
				this.shopDeliveryOrder(type)
			},
			changeSwiper1(e) {
				this.swiperCurrent1 = e.target.current
			},
			changeSwiper2(e) {
				this.swiperCurrent2 = e.target.current
			},
			navTo(url) {
				uni.navigateTo({
					url: url
				})
			},
			pickUpCode(item) {
				uni.navigateTo({
					url: '/pages/user/pickUpCode?item=' + JSON.stringify(item)
				})
			},
			confirmReceipt(item, type) {
				uni.showModal({
					title: '提示',
					content: '是否确认收货？',
					success: res => {
						if (res.confirm) {
							this.commitReceipt(item, type)
						} else if (res.cancel) {

						}
					}
				});
			},
			//确认收货
			async commitReceipt(item, type) {
				uni.showLoading({
					title: '加载中'
				});
				let res = await this.$http.receiptShopOrder({
					action: "sure_order",
					order_id: item.orid
				});
				uni.hideLoading();
				console.log(res)
				if (res.code == 200) {
					uni.showToast({
						title: '收货成功！',
						icon: 'none',
						duration: 2000
					});
					if (type == 1) {
						this.shopMentionOrder(3)
					} else {
						this.shopDeliveryOrder(5)
						this.swiperCurrent2 = 4
					}
				} else {
					uni.showToast({
						title: '操作失败！',
						icon: 'none',
						duration: 2000
					});
				}
			},
			navDetails(item, type) {
				uni.navigateTo({
					url: "/pages/detail/shop-orderDetail?item=" + JSON.stringify(item)
				})
			},
			// 自提上拉加载
			loadMore(index) {
				this.isUpLoading = true
				this.loadingText = '加载中...';
				this.mentionCurrent_page++;
				this.getMore(index + 1);
			},
			//配送订单上拉加载
			deliveryloadMore(index) {
				this.isUpLoading = true
				this.loadingText = '加载中...';
				this.deliveryCurrent_page++;
				this.getMore1(index + 1);
			},

			// 自提加载更多
			async getMore(index) {
				console.log(index)
				console.log(this.mentionCurrent_page)
				let result = await this.$http.getShopOrder({
					type: index,
					page: this.mentionCurrent_page
				})
				console.log(result)
				let data = result.data
				if (result.code == 409) {
					this.loadingText = '没有更多数据了';
					return
				}
				data.forEach(item => {
					// let mun = Number(item.or_price)
					// item.totalNum = item.or_pronum * mun
					let mun = Number(item.or_price)
					item.totalNum = parseFloat(this.$format(item.or_pronum * mun)) 
					item.status = this.$common.orderStatus(item.or_status)
				})
				this.mentionOrder.push(...data)
				console.log(this.mentionOrder)
			},
			// 配送加载更多
			async getMore1(index) {
				console.log(index)
				console.log(this.deliveryCurrent_page)
				let result = await this.$http.getDeliveryShopOrder({
					type: index,
					page: this.deliveryCurrent_page
				})
				console.log(result)
				let data = result.data
				if (result.code == 409) {
					this.loadingText = '没有更多数据了';
					return
				}
				data.forEach(item => {
					// let mun = Number(item.or_price)
					// item.totalNum = item.or_pronum * mun
					let mun = Number(item.or_price)
					item.totalNum = parseFloat(this.$format(item.or_pronum * mun)) 
					item.status = this.$common.orderStatus(item.or_status)
				})
				this.deliveryOrder.push(...data)
				console.log(this.deliveryOrder)
			},
		},
		components: {

		}
	}
</script>

<style lang="scss" scoped>
	@import 'static/css/order.scss';

	.load {
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 30upx;

		.load-tip {
			font-size: 24upx;
			color: #999999;
			margin-right: 25upx;
		}
	}

	.no-orderList {
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28upx;
		color: #999999;
		padding-top: 30%;
	}

	/* #ifdef APP-PLUS */
	.lph-order {
		min-height: 1300upx;
		// height: 1300upx;
	}

	/* #endif */
</style>
